import {Form, Input, message, Select} from 'antd';
import type { FormInstance } from 'antd/es/form';
import React, {useEffect, useState} from 'react';
import {updatePassWord} from "../../../api/user";
type PropsType = React.PropsWithChildren<{
    afterSubmit1?: (values: any, form: FormInstance<any>) => void;
    userInfo:any
}>;
const PassWordForm = (props: PropsType, ref?: React.ForwardedRef<FormInstance>) => {
    const [form] = Form.useForm();
    const [userInfo, setUserInfo] = useState({id: 0,password:""});
    useEffect(()=>{
        setUserInfo(props.userInfo)
    },[])
    // 提交后获取表单数据，请求接口，重置表单并关闭
    const onSubmit = (values: any) => {
        console.log(values);
        //await  fetch ...
        const params = {password:values.password,id:userInfo.id}
        updatePassWord(params).then((res:any) => {
            if (res.data.code === 1) {
                message.success("修改成功")
            }
        })
        form.resetFields();
        props.afterSubmit1?.(values, form);
    };

    return (
        <div className="form">
            <Form
                onFinish={onSubmit}
                ref={ref}
                form={form}
                labelCol={{ span: 4 }}
                wrapperCol={{ span: 16 }}
            >
                <Form.Item
                    label="密码"
                    name="password"
                    rules={[{ required: true, message: 'Please input  password!' }]}
                >
                    <Input.Password />
                </Form.Item>
            </Form>
        </div>
    );
};
export default PassWordForm;
